<template>
  <div class="dt-wrapper comm-box layout">
    <div class="hd">
      <h2 class="fl">楼盘动态</h2>
      <span class="fr list tab">
        <!-- <span class="span on">全部<span>({{list && list.length}})</span></span> -->
      </span>
    </div>
    <div class="news-list">
      <ul>
        <li style="cursor: pointer" v-for="(item,index) in list" :key="index">
          <div class="tip-a-time">
            <span class="news-tip">楼盘动态</span>
            <span class="news-time">{{item.created_at}}</span>
          </div>
          <div class="dyna-content">
            <p>{{item.content}}</p>
          </div>
        </li>
      </ul>
    </div>
  </div>
</template>

<script>
import { defineComponent ,reactive} from "vue";
import { useStore } from "vuex";
export default defineComponent({
  props: {
      list: Array
  },
  setup(props) {


    return {
    };
  },
});
</script>


<style lang="scss">
.dt-wrapper {
  position: relative;
  margin: 55px 0;
  background-color: #fff;
  .hd {
    height: 50px;
    border-bottom: 1px solid #efefef;
    display: flex;
    justify-content: space-between;
    margin: 0;

    h2 {
      font-size: 24px;
      font-weight: bold;
      line-height: 24px;
    }
    .tab {
      .span {
        display: inline-block;
        height: 24px;
        line-height: 24px;
        margin-left: 33px;
        color: #9b9b9b;
        cursor: pointer;
        font-size: 14px;
      }
      .on {
        color: #3f85ff;
      }
    }
  }

  .news-list {
    ul {
      li {
        cursor: pointer;
        margin-top: 20px;
        border-bottom: 1px solid #efefef;
        color: #333;
        .tip-a-time {
          display: flex;
          justify-content: space-between;
          .news-tip {
            background: rgba(63, 133, 255, 0.12);
            display: inline-block;
            height: 22px;
            padding: 0 10px;
            line-height: 22px;
            font-size: 14px;
            color: #3f85ff;
          }
          .news-time {
            font-size: 15px;
            color: #9b9b9b;
            letter-spacing: 0;
            text-align: right;
            line-height: 23px;
            float: right;
          }
        }
        .dyna-content {
          font-size: 15px;
          color: #333333;
          line-height: 23px;
          margin: 20px 0;
        }
      }
    }
  }
}
</style>